import React, { Component } from 'react';
import {StyleSheet, View} from "react-native";
import ScrollableTabView, {ScrollableTabBar} from "react-native-scrollable-tab-view";
import List from "../list/List";



type Props = {};
export default class BuyCoin extends Component<Props> {
    constructor(Props) {
        super(Props)
    }
    render() {
        return (
            <View style={styles.wrapper}>
                <ScrollableTabView
                    tabBarUnderlineStyle={{backgroundColor: '#ff7807', height: 1}}
                    tabBarActiveTextColor='#ff7807'
                    tabBarTextStyle={{fontSize: 15}}
                    tabBarInactiveTextColor = '#808080'
                    renderTabBar={() => <ScrollableTabBar style={{borderWidth: 0}}/>}
                >
                    <List toBuy={this.props.toBuy} toSell={this.props.toSell} sellToken={'hkd'} buyToken={'fcc'} type={1} tabLabel="FCC(HKD)"/>
                    {/*<List toBuy={this.props.toBuy} sellToken={'hkd'} buyToken={'fcc'} type={2} tabLabel="FCC(321)"/>*/}
                </ScrollableTabView>
            </View>
        )
    }

}


const styles = StyleSheet.create({
    container: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#f2f2f2',
    },
    header: {
        height: 90,
        paddingTop: 20,
        width: '100%',
        backgroundColor: '#fff'
    },
    wrapper: {
        flex: 1,
        width: '95%',
        borderRadius: 10,
        backgroundColor: '#fff',
        marginTop: 10
    }
});
